<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html; charset=utf-8"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>平台管理系统</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
	<link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all">
	<link rel="stylesheet"href="/css/plat-style.css">
	<style>
		thead tr th{text-align: center!important;font-weight: bold!important;}
		tr td{text-align: center!important;}
	</style>
</head>
<body>
<div class="layui-fluid">
	<div class="layui-row layui-col-space15">
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md12">
				<div class="layui-card">
					<div class="layui-card-header">折线图</div>
					<div class="layui-card-body">
						<div>
							<span onclick="newData('day',this)" class="layui-badge">天</span>
							<span onclick="newData('week',this)">周</span>
							<span onclick="newData('month',this)">月</span>
						</div>
						<div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" id="echarts-1">
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
</div>

<script src="/layuiadmin/layui/layui.js"></script>
<script type="text/javascript" src="/js/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/js/common.js"></script>
<script type="text/javascript" src="/js/echarts/echarts.min.js"></script>
<script>
	/*layui.config({
		base: '/layuiadmin/' //静态资源所在路径
	}).extend({
		index: 'lib/index' //主入口模块
	}).use(['index', 'senior']);*/

	function newData(type,obj){
		$(obj).parent().find("span").removeClass("layui-badge");
		$(obj).addClass("layui-badge");
		var xData = [];
		var series = [];

		$.ajaxSettings.async = false;
		$.post("/statis/queryRefundMoneyStatis",{"type":type},function(result){
			var data = result.data;
			xData = data.date;
			series = data.series;
			for (var i = 0; i <series.length; i++){
				series[i].type = 'line';
				series[i].symbolSize = 10;
				series[i].symbol = 'circle';
			}
		});
		$.ajaxSettings.async = true;

		var echarts1 = echarts.init(document.getElementById('echarts-1'));
		var echarts1_option = {
			title: {
				show: false,
			},
			tooltip: {
				trigger: 'axis'
			},
			legend: {
				x : 'center',
				y : 'top',
				data: ['销售额','退款额']
			},
			xAxis: {
				data: xData,
			},
			yAxis:{
				type: 'value',
				nameTextStyle: {
					// 坐标轴名称的文字样式
				},
				axisLine: {
					// 坐标轴轴线相关设置
				}
			},
			series: series
		}
		echarts1.setOption(echarts1_option);
	}

	$(function () {
		newData('day'); // 默认天
	});
</script>
</body>
</html>